{extend name="layouts@base" /}
{block name="head"}
<!-- <link rel="stylesheet" href="__STATIC__/mobile/default/css/userData.css" /> -->
<style>
    .layui-form-label {
        width: unset;
    }

    .layui-form select {
        display: block;
    }

    .layui-form-select {
        margin-bottom: 0.1rem;
    }

    .re {
        position: relative;
        overflow: hidden;
        display: inline-block;
    }

    .uploadInput {
        position: absolute;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        opacity: 0;
    }

    .userimg {
        width: 1rem;
        height: 1rem;
    }

    .seauii  {
        -webkit-appearance: button;
    }
</style>
{/block}
{block name="main" }

<div class="page-bd">
    <!-- 页面内容-->
    <form class="layui-form bg m" id="userform">
        <div class="layui-form-item">
            <div class="layui-form-label">门店名称</div>
            <div class="layui-input-block">
                <input name="store_name" class="layui-input" id="store_name" value="{$data.store_name}"
                    placeholder="请输门店名称">
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-form-label">联系人姓名</div>
            <div class="layui-input-block">
                <input name="username" class="layui-input" id="username" value="{$data.username}" placeholder="请输联系人姓名">
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-form-label">联系电话</div>
            <div class="layui-input-block">
                <input name="store_phone" class="layui-input" id="store_phone" value="{$data.store_phone}"
                    placeholder="请联系电话">
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-form-label">身份证号</div>
            <div class="layui-input-block">
                <input name="identity_card" class="layui-input" id="identity_card" value="{$data.identity_card}"
                    placeholder="请输身份证号">
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-form-label">选择区域</div>
            <div class="layui-input-block">
                <tr>
                    <td>
                        <div class="layui-unselect layui-form-select layui-form-select">
                            <div class="layui-select-title"> 
                                <select class="seauii layui-input" name="province_id"
                                    id="province" onChange="get_city(this)">
                                    <option value="0">请选择</option>
                                    {volist name="province" id="p"}
                                    <option {if
                                        condition="isset($data['province_id']) &&$data['province_id'] eq $p['id']"
                                        }selected{/if} value="{$p.id}">{$p.name}</option>
                                    {/volist}
                                </select>
                            </div>
                        </div>
                        <div class="layui-unselect layui-form-select layui-form-select">
                            <div class="layui-select-title"> 
                                <select class="seauii layui-input" name="city_id" id="city" onChange="get_area(this)">
                                    <option value="">请选择</option>
                                    {if isset($city)}
                                    {volist name="city" id="p"}
                                    <option {if condition="isset($data['city_id']) &&$data['city_id'] eq $p['id']"
                                        }selected{/if} value="{$p.id}">{$p.name}</option>
                                    {/volist}
                                    {/if}
                                </select>
                            </div>
                        </div>
                        <div class="layui-unselect layui-form-select layui-form-select">
                            <div class="layui-select-title"> 
                                <select class="seauii layui-input" name="district_id" id="district">
                                    <option value="0">请选择</option>
                                    {if isset($city)}
                                    {volist name="district" id="p"}
                                    <option {if condition="isset($data['district_id']) &&$data['district_id'] eq $p['id']"
                                        }selected{/if} value="{$p.id}">{$p.name}</option>
                                    {/volist}
                                    {/if}
                                </select>
                            </div>
                        </div>
                        <br>
                    </td>
                </tr>
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-form-label">详细地址</div>
            <div class="layui-input-block">
                <input name="store_address" class="layui-input" id="store_address" value="{$data.store_address}"
                    placeholder="请输入详细地址">
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-form-label">门店介绍</div>
            <div class="layui-input-block">
                <textarea name="desc" placeholder="请输入门店介绍" value="{$data.introduction}"
                    class="layui-textarea"></textarea>
            </div>
        </div>

        <div class="layui-form-item">
            <div class="layui-form-label">门店照片</div>
            <div class="layui-input-block">
                <span class="re">
                    <button type="button" class="layui-btn">上传图片</button>
                    <input type="file" class="uploadInput" onchange="uploadFile(this,event)">
                </span>
                <img src="{$data.store_img|default='__STATIC__/mobile/default/images/defheadimg.jpg'}" alt=""
                    name="store_img" class="userimg userimg1">
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-form-label">身份证正面</div>
            <div class="layui-input-block">
                <span class="re">
                    <button type="button" class="layui-btn">上传图片</button>
                    <input type="file" class="uploadInput" onchange="uploadFile2(this,event)">
                </span>
                <img src="{$data.identity_img_one|default='__STATIC__/mobile/default/images/defheadimg.jpg'}" alt=""
                    name="identity_img_one" class="userimg userimg2">
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-form-label">身份证反面</div>
            <div class="layui-input-block">
                <span class="re">
                    <button type="button" class="layui-btn">上传图片</button>
                    <input type="file" class="uploadInput" onchange="uploadFile3(this,event)">
                </span>
                <img src="{$data.identity_img_tow|default='__STATIC__/mobile/default/images/defheadimg.jpg'}" alt=""
                    name="identity_img_tow" class="userimg userimg3">
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-form-label">营业执照</div>
            <div class="layui-input-block">
                <span class="re">
                    <button type="button" class="layui-btn">上传图片</button>
                    <input type="file" class="uploadInput" onchange="uploadFile4(this,event)">
                </span>
                <img src="{$data.business_license|default='__STATIC__/mobile/default/images/defheadimg.jpg'}" alt=""
                    name="business_license" class="userimg userimg4">
            </div>
        </div>
        <div class="layui-form-item">
            <div class="layui-form-label">门店LOGO</div>
            <div class="layui-input-block">
                <span class="re">
                    <button type="button" class="layui-btn">上传图片</button>
                    <input type="file" class="uploadInput" onchange="uploadFile5(this,event)">
                </span>
                <img src="{$data.store_logo_img|default='__STATIC__/mobile/default/images/defheadimg.jpg'}" alt=""
                    name="store_logo_img" class="userimg userimg5">
            </div>
        </div>
        <input name="user_id" type="hidden" class="layui-input" id="user_id" value="{$data.user_id}" placeholder="">
    </form>
    <div class="page-ftb">
        <span class="fs32 color_w fw_b BGcolor_r editpwd">确认申请</span>
    </div>
</div>


{/block}

{block name="footer"}
<style>
    .cell .cell_ft .userimg1 {
        width: 0.533333rem;
        height: 0.533333rem;
    }

    .cell .cell_ft .userimg2 {
        width: 0.533333rem;
        height: 0.533333rem;
    }

    .cell .cell_ft .userimg3 {
        width: 0.533333rem;
        height: 0.533333rem;
    }

    .cell .cell_ft .userimg4 {
        width: 0.533333rem;
        height: 0.533333rem;
    }

    .cell .cell_ft .userimg5 {
        width: 0.533333rem;
        height: 0.533333rem;
    }
</style>
<script src="__STATIC__/mobile/default/js/datePicker.js"></script>
<script src="__STATIC__/mobile/default/js/picker.min.js"></script>
<script>
    //Demo
</script>
<script type="text/javascript">
    var fd = new FormData();
    //选择上传图片
    function uploadFile(_this, e) {
        compress(e, function (base64Img) {
            fd.append("imgfile1", base64Img);
            $('.userimg1').attr('src', base64Img);
        })
    }
    function uploadFile2(_this, e) {
        compress(e, function (base64Img) {
            fd.append("imgfile2", base64Img);
            $('.userimg2').attr('src', base64Img);
        })
    }
    function uploadFile3(_this, e) {
        compress(e, function (base64Img) {
            fd.append("imgfile3", base64Img);
            $('.userimg3').attr('src', base64Img);
        })
    }
    function uploadFile4(_this, e) {
        compress(e, function (base64Img) {
            fd.append("imgfile4", base64Img);
            $('.userimg4').attr('src', base64Img);
        })
    }

    function uploadFile5(_this, e) {
        compress(e, function (base64Img) {
            fd.append("imgfile5", base64Img);
            $('.userimg5').attr('src', base64Img);
        })
    }

    // $('.postBtn').click(function(){
    //     var data = $('#userform').toJson();
    //     $.each(data,function(i,v){
    //         fd.append(i, v);
    //     })
    //
    //     $.ajax({
    //         url: '{:url("member/api.users/editInfo")}',
    //         type: 'post',
    //         processData: false,
    //         contentType: false,
    //         data: fd,
    //         success: function (res) {
    //             if (res.code == 0){
    //                 _alert(res.msg);
    //                 return false;
    //             }
    //             _alert(res.msg,'{:url("member/center/index")}');
    //         }
    //     })
    // })
    /**
     * 获取城市
     * @param t  省份select对象
     */
    function get_city(t) {
        // $('#city').css('display','block');
        var parent_id = $(t).val();
        if (!parent_id > 0) {
            return;
        }
        $('#district').empty().css('display', 'none');
        $('#twon').empty().css('display', 'none');
        var url = 'getRegion?level=2&parent_id=' + parent_id;
        $.ajax({
            type: "GET",
            url: url,
            error: function (request) {
                alert("服务器繁忙, 请联系管理员!");
                return;
            },
            success: function (v) {
                v = '<option value="0">选择城市</option>' + v;
                $('#city').empty().html(v);
            }
        });
    }

    /**
     * 获取地区
     * @param t  城市select对象
     */
    function get_area(t) {
        // $('#district').css('display','block');
        var parent_id = $(t).val();
        if (!parent_id > 0) {
            return;
        }
        $('#district').empty().css('display', 'inline');
        $('#twon').empty().css('display', 'none');
        var url = 'getRegion?level=2&parent_id=' + parent_id;
        $.ajax({
            type: "GET",
            url: url,
            error: function (request) {
                alert("服务器繁忙, 请联系管理员!");
                return;
            },
            success: function (v) {
                v = '<option value="0">选择区域</option>' + v;
                $('#district').empty().html(v);
            }
        });
    }

    $('.editpwd').on('click', function () {
        var arr = new Object();
        arr.province_id = $('select[name="province_id"]').find('option:selected').val();
        arr.city_id = $('select[name="city_id"]').find('option:selected').val();
        arr.district_id = $('select[name="district_id"]').find('option:selected').val();
        arr.store_name = $('input[name="store_name"]').val();
        arr.username = $('input[name="username"]').val();
        arr.store_phone = $('input[name="store_phone"]').val();
        arr.identity_card = $('input[name="identity_card"]').val();
        arr.store_address = $('input[name="store_address"]').val();
        arr.user_id = $('input[name="user_id"]').val() ? $('input[name="user_id"]').val() : '';
        // arr.store_address = user_id : user_id ? '';
        // arr.type =  $('select[name="type"]').find('option:selected').val();
        // var img = $('#userimg1')[0].src
        arr.identity_img_one = $('.userimg1').attr('src')
        arr.identity_img_tow = $('.userimg2').attr('src')
        arr.business_license = $('.userimg3').attr('src')
        arr.store_img = $('.userimg4').attr('src')
        arr.store_logo_img = $('.userimg5').attr('src')
        // console.log(arr); return false;
        var data = $('#userform').toJson();
        $.each(data, function (i, v) {
            fd.append(i, v);
        })
        $.ajax({
            url: '{:url("add_distribution_store")}',
            type: 'post',
            processData: false,
            contentType: false,
            data: fd,
            success: function (res) {
                // console.log(res);
                if (res.code == 0) {
                    _alert(res.msg);
                    return false;
                } else {
                    _alert(res.msg);
                    _alert(res.msg, '{:url("member/center/index")}');
                }
                // _alert(res.msg,'{:url("member/center/index")}');
            }
        })

        // jq_ajax('{:url("add_user_region")}',arr,function (res) {
        //     // console.log(res);
        //     if (res.code == 0) {
        //         _alert(res.msg);
        //         return false;
        //     }
        //      _alert(res.msg,'{:url("member/center/index")}');
        // })
    })
</script>


{/block}